<template>
	<view v-if="loading || error" class="loading_view">
		<u-loading mode="circle" v-if="loading" size="50"></u-loading>
		<u-toast ref="uToast" />
		<view class="messgae">{{ loading?'加载中...':'加载失败' }}</view>
	</view>
	<view v-else style="background-color: #EFEFEF;height: auth;overflow: auto;">
		<u-toast ref="uToast" />
		<view class="user_info">
			<view class="user_view">
				<view class="icon" @click="upload_file">
					<view v-if="text!=''" class="text_box">{{ text }}</view>
					<image v-if="user.u_icon!=''" :src="user.u_icon"></image>
					<image v-else-if="user.u_sex==2" src=""></image>
					<image v-else src=""></image>
				</view>
				<view class="info" v-if="store.Authorization">
					<view class="nickname">
						<text class="hg" v-if="user.is_sup==1">{{user.u_nickname}}</text>
						<text class="hy" v-else-if="user.is_mem==1">{{user.u_nickname}}</text>
						<text v-else>{{user.u_nickname}}</text>
						<image src="../../static/image/hg.png" v-if="user.is_sup==1"></image>
						<image src="../../static/image/hy.png" v-else-if="user.is_mem==1"></image>
					</view>
					<view v-if="user.is_sup==1">超会到期时间：{{user.u_supremeTime}}</view>

					<view v-if="user.is_mem==1">会员到期时间：{{user.u_memberTime}}</view>
					<view v-else>未开通会员</view>
				</view>
				
				<view class="info" style="margin-left: 30rpx;" v-else>
					<view style="display: flex;">
						<text @click="wx_login">登录</text>
						<!-- <text style="margin: 0 10rpx;">/</text>
						<navigator url="/pages/register/register" open-type="navigate">注册</navigator> -->
					</view>
					<!-- <view ></view> -->
				</view>
				
			</view>
			<view class="like_info">
				
				<view class="like_item" @click="onUrl('/pages/user/my_like?type=1')">
					<view class="num">{{ user.u_like }}</view>
					<view class="name">我喜欢</view>
				</view>
				
				<view class="like_item" @click="onUrl('/pages/user/my_like?type=2')">
					<view class="num">{{ user.u_mutualLike }}</view>
					<view class="name">互相喜欢</view>
				</view>
				
				<view class="like_item" @click="onUrl('/pages/user/my_like?type=3')">
					<view class="num">{{ user.u_likeMe }}</view>
					<view class="name">喜欢我</view>
				</view>
			</view>
			
		</view>
		
		<view class="item_box">
			
			<navigator url="/packageA/my_prove/my_prove" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">我的认证</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<navigator url="/packageA/myinfo/myinfo" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">基本资料</view>
					
					<view class="right_item">{{ user.u_height }}cm {{ education[user.u_education] }} </view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			
			<navigator url="/pages/user/my_images" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">我的相册</view>
					
					<view class="right_item">{{ user.u_album.length }}</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			
			</navigator>
			
			<navigator url="/pages/user/my_dynamic" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">我的动态</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			
			</navigator>
			
			<navigator url="/pages/user/my_course" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">我的课程</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			
		</view>
		
		
		
		<view class="item_box">
			
			<navigator url="/pages/user/my_hobby" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">兴趣爱好</view>
					
					<view class="right_item">已选择{{ user.u_hobby.length }}项</view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<navigator url="/pages/mate_selection/mate_selection" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">择偶要求</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			
			<navigator url="/pages/changPassword/changPassword" open-type="navigate">
			
			<view class="item_view">
				<view class="cen">
					<view class="left_item">修改密码</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
		
		</view>
		
		<view class="item_box">
			
			<navigator url="/pages/myCoupons/myCoupons" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">优惠券</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			
			<navigator url="/pages/user/my_member" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">开通会员</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<navigator url="/pages/invitation/invitation" open-type="navigate">
			<view class="item_view">
				<view class="cen">
					<view class="left_item">免费获取会员</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
			</navigator>
			
			<view class="item_view" @click="exit">
				<view class="cen">
					<view class="left_item">退出登录</view>
					
					<view class="right_item"></view>
				</view>
				
				<i class="exit_icon"></i>
			</view>
		
		</view>
		
	</view>
</template>

<script>
	import config from '../../static/js/config.js'
	import {mapState,mapMutations} from 'vuex'
	export default {
		data() {
			return {
				city:'',
				age:0,
				user:{
					u_nickname: "",
					u_icon: "",
					u_album:[],
					u_like: 0,
					u_likeMe: 0,
					u_mutualLike: 0,
					u_hobby: [],
					u_autograph: "",
					u_icon_prove: 0,
					u_sex: 1,
					u_birthday: 0,
					u_height: 0,
					u_education: 0
				},
				store:null,
				education:['未选择','高中','中专','大专','本科','硕士','博士'],
				loading:false,
				error:false,
				action:config.url+'/upload',
				text:'',
				upload_status:false
			}
		},
		methods: {
			wx_login(){
				
				this.loading = true
				
				let that = this
				
				uni.openSetting({
						success(res){
							
							// 判断是否授权成功
							if(res.authSetting['scope.userInfo']){
			
								uni.login({
									provider:'weixin',
									success(res2){
										uni.getUserInfo({
											withCredentials:true,
										    success(res3) {
												that.$request({
													url:'/login/wxLogin',
													data:{code:res2.code,iv:res3.iv,rawData:res3.rawData,wx_signature:res3.signature,encryptedData:res3.encryptedData},
													method:'post',
													success(res){
														if(res.statusCode==200){
																
															if(res.data.code==1){
																that.$store.commit('changeLogin',res.data.data.token)
																
																that.$store.commit('setOpenid',res.data.data.openId)
																
																that.$store.commit('messageSocket')
																
																uni.reLaunch({
																	url: '/pages/loading/loading1'
																})
															}else{
																that.$refs.uToast.show({
																	title: res.data.msg,
																	type: 'warning'
																})
																
																that.error = true
															}
															
														}else{
															that.$refs.uToast.show({
																title: '网络繁忙',
																type: 'warning'
															})
															
															that.error = true
														}
													},
													fail(err){
														that.$refs.uToast.show({
															title: '请求失败',
															type: 'warning'
														})
														
														that.error = true
													},
													complete(){
														that.loading = false
													}
												})
												
										    },
										    fail() {
										       that.$refs.uToast.show({
										       	title: '开启失败',
										       	type: 'warning'
										       })
												
												that.error = true
												
												that.loading = false
										    }
										})
									},
									fail(err){
										that.error = true
										
										that.loading = false
									}
								})
			
							}
						},
						fail(err){
			
							uni.navigateTo({
								url: '/pages/select_sex/select_sex'
							})
							
						}
					})
			},
			exit(){
				let that = this
				uni.showModal({
				    title: '提示',
				    content: '确定退出登录吗',
				    success: function (res) {
						if(res.confirm){
							that.$store.commit('clearToken')
							
							that.$refs.uToast.show({
								title: '操作成功',
								type: 'success'
							})
							
							uni.reLaunch({
							    url: '/pages/login/login'
							})
						}
				    }
				})
			},
			upload_file(){
				if(this.upload_status){
					
					this.$refs.uToast.show({
						title: '您当前不能进行该操作',
						type: 'warning'
					})
					
					return false
				}
				/* 更改会员图标 */
				let that = this
				uni.chooseImage({
				    success: (chooseImageRes) => {
						that.upload_status = true
				        const tempFilePaths = chooseImageRes.tempFilePaths;
						that.text = '上传中...'
				        uni.uploadFile({
				            url: that.action, //仅为示例，非真实的接口地址
				            filePath: tempFilePaths[0],
				            name: 'file',
				            success: (uploadFileRes) => {
								let data=JSON.parse(uploadFileRes.data)
								
								if(data.code==1){
									let info={
										sendUser:this.sendUser,
										fromUser:this.fromUser
									}
									
									that.$request({
										url:'/user/update_icon',
										data:{src:data.src},
										method:'post',
										success(res){
											if(res.statusCode==200){
												if(res.data.code==1){
													that.$refs.uToast.show({
														title: '上传成功',
														type: 'success'
													})
													
													that.text = '审核中'
													
													that.user.u_icon = res.data.data
												}else{
													that.$refs.uToast.show({
														title: res.data.msg,
														type: 'warning'
													})
													
													that.upload_status = false
												}
											}else{
												that.$refs.uToast.show({
													title: '网络繁忙',
													type: 'warning'
												})
												
												that.upload_status = false
											}
										},
										fail(err){
											that.$refs.uToast.show({
												title: '请求失败',
												type: 'warning'
											})
											
											that.upload_status = false
										}
									})
									
								}else{
									
									that.$refs.uToast.show({
										title: '上传失败',
										type: 'warning'
									})
									
									that.upload_status = false
									
								}
				            }
				        });
				    }
				})
			},
			onUrl(url){
				uni.navigateTo({
				    url: url
				});
			},
			getData(){
				this.loading = true
				this.error = false
				let that = this
				this.$request({
					url:'/user',
					method:'post',
					success(res){
						
						if(res.statusCode==200){
							if(res.data.code==1){
								
								if(res.data.data.u_album==''){
									res.data.data.u_album=[]
								}else{
									
									res.data.data.u_album = JSON.parse(res.data.data.u_album)
									
								}
								
								let time=Math.round(new Date().getTime()/1000)
								
								that.age = Math.floor((time-res.data.data.u_birthday)/31536000)
								
								if(res.data.data.u_city){
									
									that.city=res.data.data.u_city.split(',')
									
									that.city=that.city[1]
									
								}
								
								
								if(!res.data.data.u_hobby){
									res.data.data.u_hobby=[]
								}else{
									res.data.data.u_hobby=res.data.data.u_hobby.split(',')
								}
								
								// console.log(res.data.data.u_hobby)
								
								that.user = res.data.data
								
								that.like=that.user.u_like
								
								that.mutualLike=that.user.u_mutualLike
								
								that.likeMe=that.user.u_likeMe
								
								if(that.user.p_status==0){
									that.upload_status = true
									that.text='审核中'
								}else if(that.user.p_status==-1){
									
									that.text='审核未通过'
								}else{
									that.text=''
									
									that.upload_status = false
								}
							}else{
								that.$refs.uToast.show({
									title: res.data.msg,
									type: 'warning'
								})
								
								if(res.data.code!=101 && res.data.code!=102 && res.data.code!=103){
									that.error = true
								}else{
									uni.reLaunch({
										url: '/pages/login/login',
									});
								}
							}
						}else{
							that.$refs.uToast.show({
								title: '网络繁忙',
								type: 'warning'
							})
							
							that.error = true
						}
						
					},
					fail(){
						that.$refs.uToast.show({
							title: '获取失败~',
							type: 'warning'
						})
						
						that.error = true
					},
					complete(){
						that.loading = false
						
						uni.stopPullDownRefresh()
					}
				})
			}
		},
		onLoad(){
			this.store = this.$store.state
			this.getData()
			console.log(this.$store.state.port)
		},
		onPullDownRefresh(){
			this.getData()
		}
	}
</script>

<style scoped>
.user_info{
	width:750rpx;
	display: flex;
	flex-direction: column;
	font-size: 26rpx;
	background-color: #fff;
}
.user_info .user_view{
	display: flex;
	height: 160rpx;
	align-items: center;
	border-bottom: 1px solid #EFEFEF;
}
.user_info .user_view .icon,.user_info .user_view .icon image{
	width:120rpx;
	height: 120rpx;
}
.user_info .user_view .icon{
	border-radius: 120rpx;
	overflow: hidden;
	margin: 0 20rpx;
	position: relative;
}
.user_info .user_view .icon .text_box{
	width:120rpx;
	height: 120rpx;
	color:#fff;
	position: absolute;
	background-color: rgba(0,0,0,0.5);
	left:0;
	top:0;
	z-index:1;
	text-align: center;
	line-height: 120rpx;
}
.user_info .user_view .info{
	color:#888;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.user_info .user_view .info .nickname{
	color:#000;
	font-size: 30rpx;
	margin-bottom: 10rpx;
}
.user_info .user_view .info .nickname .hg{
	color:#FFCC00
}
.user_info .user_view .info .nickname .hy{
	color:#D81E06
}
.user_info .user_view .info .nickname image{
	width:30rpx;
	height:30rpx;
	margin-left:20rpx;
}
.user_info .like_info{
	height: 140rpx;
	width: 750rpx;
	display: flex;
	justify-content: space-around;
	text-align: center;
	align-items: center;
}
.user_info .like_info .like_item view{
	margin-top:10rpx;
	color:#888;
}
.user_info .like_info .like_item view.num{
	color: #000;
	font-size: 30rpx;
}
	.item_box{
		display: flex;
		flex-direction: column;
		margin-top: 30rpx;
		font-size: 32rpx;
	}
	.item_box:last-child{
		margin-bottom: 30rpx;
	}
	.item_box .item_view{
		width:750rpx;
		background-color: #FFFFFF;
		display: flex;
		justify-content: center;
		position: relative;
	}
	.item_box .item_view .cen{
		width: 640rpx;
		height: 100rpx;
		border-bottom: 1px solid #EFEFEF;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.item_box .item_view .cen .right_item{
		color: #888888;
	}
	.exit_icon{
		padding:10rpx;
		background: url('') no-repeat;
		background-size: 20rpx;
		position: absolute;
		top:35rpx;
		right: 15rpx;
	}
</style>